<template>
	<view style="min-height: 100vh;position: relative;background-color: #f2f2f2;">
		<u-navbar title='任务·全部门店 '   left-icon-color="white" :autoBack="true" :titleStyle="{'color':'white'}" bgColor="#13989a"
			:placeholder="true"></u-navbar>
		<!-- <view class="shopName">
			
		</view> -->
		<view class="container">
			<!-- <u-subsection activeColor="#2979ff" :list="list" :current="current" @change="sectionChange"></u-subsection> -->
			<view v-if="taskList.length">
				<view class="floor" v-for="(v,i) in taskList" :key="i"
				@click="toPath(v)"
					style="font-size: 24rpx;color: #a1a1a1;margin-top: 20rpx;">
					<view class="title flex" style="justify-content: space-between;color: black;margin: 10rpx 0;">
						<text>{{v.assignTaskName}}</text>
						<view style="width: 100rpx;">
							<u-tag text="未开始" size="mini" type="warning" v-if="v.state==0"></u-tag>
							<u-tag text="已完成" size="mini"  v-if="v.state==1"></u-tag>
							<u-tag text="已逾期" size="mini"  type="error" v-if="v.state==2"></u-tag> 
						</view>
					</view>
					<view class="flex" style="justify-content: space-between;">
						<view style="margin: 10rpx 0;color: #5f5f5f;">
								巡查开始时间{{v.inspectionTaskStartTime}}
						</view>
						<view style="margin: 10rpx 0;color: #5f5f5f;">
								巡查结束时间{{v.inspectionTaskEndTime}}
						</view>
					</view>
					<view class="flex" style="margin: 10rpx 0;">
						<view class="tag">
							创建人：{{v.createPerson}}
						</view>
					</view>
					<!-- <view
					class="flex"
						style="justify-content: space-between;align-items: center;font-size: 28rpx;color: #5f5f5f;padding: 30rpx;background-color:#f7f7f7;border-radius: 10rpx;">
						 <view class="flex" style="justify-content: space-between;align-items: center;">
						 	<image src="https://renovationcdn.jiachuangnet.com/index/indexBg.png" mode="" style="width: 120rpx;height: 100rpx;"></image>
						 	<text style="margin-left: 10rpx;">有人推迟开门</text>
						 </view>
						
					</view> -->
				
				</view>
			</view>
			<view v-else>
				<view style="width: 100%;height: 50vh;" >
					<u-empty
					        icon="https://renovationcdn.jiachuangnet.com/empty.jpg"
							width="100%"
							height="100%"
							text="数据为空"
					>
					</u-empty>
				</view>
			</view>

		</view>
		<u-popup :show="shopNameShow" @close="shopNameShow=false" round="10" mode="bottom">
			<view class="overdueForm" style="padding-top: 20rpx;height: 80vh;overflow-y: auto;">
				<view style="text-align: center;font-size: 30rpx;margin-bottom: 50rpx;">
					选择门店
				</view>
				<view class="workerSearch" style="">
					<image style="width: 34rpx;height: 34rpx;"
						src="https://renovationcdn.jiachuangnet.com/index/workerIndex/search.png"></image>
					<u-input placeholder="请输入门店名称搜索" style="height: 78rpx;" v-model="keyword"></u-input>
				</view>
				<u-subsection activeColor="#13989A" :list="list1" :current="current1"
					@change="sectionChange1"></u-subsection>
				<view class="floor" style="border-bottom: 1rpx solid #d4d4d4;">
					<view class="title">
						测试门店
					</view>
				</view>
			</view>
		</u-popup>
		<u-popup :show="todoListShow" @close="todoListShow=false" round="10" mode="bottom">
			<view class="overdueForm" style="padding: 20rpx;height: 80vh;overflow-y: auto;" v-if="todoVoList[activeIndex]">
				<view style="text-align: center;font-size: 30rpx;margin-bottom: 50rpx;">
					{{todoVoList[activeIndex].assignName}}
				</view>
				<view class="floor" style="background-color: #f2f2f2;">
					<view style="margin: 10rpx 0;">
						{{todoVoList[activeIndex].templateName}}
					</view>
					<view class="flex" style="margin: 10rpx 0;">
						<view class="tag" style="background-color: #ffffff;">
							提交人：{{todoVoList[activeIndex].patrolUserName}}
						</view>
						<view class="tag" style="background-color: #ffffff;">
							{{todoVoList[activeIndex].createTime}}
						</view>
					</view>
				</view>
				<view class="floor" v-for="(v,i) in rectificationApprovalVoList" @click="toPath(v,i)" :key="i"
					style="background-color: #f2f2f2;border-radius: 10rpx;">
					<view class="title">
						{{v.problemName}}
					</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// list: ['全部', '待整改', '待审核', '已完成'],
				list1: ['按店铺', '按区域'],
				current: 0,
				current1: 0,
				todoVoList: [],
				templateName: '',
				shopNameShow: false,
				todoListShow: false,
				activeIndex: 0,
				rectificationApprovalVoList: [],
				taskList:[],
				keyword:''
			}
		},
		onShow() {
			// this.getTodoVo()
			// if(this.todoListShow){
			// 	this.handler(this.activeIndex)
			// }
			
			this.getInspectionTaskList()
		},
		methods: {
			getInspectionTaskList() {
				uni.$u.http.get('/inspectionTask/getInspectionTaskList', {
					params: {
						pageNum: 1,
						pageSize: 1000
					}
				}).then(res => {
					if(res){
						this.taskList=res.data
					}
				})
			},
			sectionChange(e) {
				this.current = e
				this.getTodoVo()
			},
			sectionChange1(e) {
				this.current1 = e
			},
			toPath(v) {
				if(v.state==1){
					return uni.$u.toast('当前任务已完成 :)');
				}
				if(v.state==2){
					return uni.$u.toast('当前任务已逾期 :)');
				}
				 //1 在线巡查 2 线下巡查 3 在线点检 4 线下点检
				uni.navigateTo({
					url: `/packageC/pages/oLineAssessment/assessment?assignTaskId=${v.assignTaskId}&patrolType=${2}&templateId=${v.templateId}&autoPatrolPlanId=${v.autoPatrolPlanId}&autoPatrolPlanDetailId=${v.autoPatrolPlanDetailId}`
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.tag {
		margin-left: 10rpx;
		padding: 5rpx 10rpx;
		border-radius: 10rpx;
		background-color: #f9f9f9;
		font-size: 28rpx;
	}

	.shopName {
		padding-top: 150rpx;
		text-align: center;
		font-weight: 700;
		font-size: 30rpx;
		z-index: 1000;
		line-height: 100rpx;
	}

	.container {
		width: 92vw;
		padding: 30rpx;
		z-index: 10;
		position: absolute;
		top: 160rpx;
		overflow: hidden;
		border-radius: 20rpx;
	}

	.workerSearch {
		border-radius: 40rpx;
		display: flex;
		align-items: center;
		padding-left: 22rpx;
		width: 100%rpx;
		height: 60rpx;
		background-color: #e6e6e6;
		opacity: 0.9;
		margin: 10rpx 0;
	}

	.floor {
		background-color: #fff;
		border-radius: 10rpx;
		padding: 20rpx;
		margin-bottom: 20rpx;

		.title {
			font-weight: 600;
			font-size: 30rpx;
		}
	}

	.floor1 {
		background-color: #fff;
		border-radius: 10rpx;
		margin-bottom: 20rpx;
		overflow: hidden;

		.title {
			font-weight: 600;
			font-size: 30rpx;
		}
	}
</style>